<template>
<div>
  <div class="bg">
    <img src="@/assets/5.png" alt="" srcset="" width="100%">
  </div>
  <div class="wrap">
    <van-tabs v-model="active" animated>
      <van-tab v-for="(item,index) in arr" :title="item.title" :key="index">
        <img :src="item.img" alt="" width="100%">
      </van-tab>
    </van-tabs>
  </div>
</div>
</template>

<script>
import 'vant/lib/index.css';
import img1 from '@/assets/1.png'
import img2 from '@/assets/2.png'
import img3 from '@/assets/3.png'
import img4 from '@/assets/4.png'
  export default {
    data() {
      return {
        active :0,
        arr :[
          {
            title:'酒精',
            img: img1
          },
           {
            title:'口罩',
            img: img2
          },
           {
            title:'洗手液',
            img: img3
          },
           {
            title:'温度计',
            img: img4
          }
        ]
        }
    },
  }
</script>

<style scoped>
.wrap{
  padding: 30px;
  background-color: #3343ff;
}
</style>
